In two-dimensional (2D) Canvas specifications of an HTML5 technology, a set of 2D Canvas drawing Application Programming Interfaces (APIs) are defined. By using these APIs, 2D graphic drawing in an immediate mode can be carried out on a web page. As described herein, Canvas may refer to a canvas or a drawable area on a web page that contains various drawing elements. If the web page contains a Canvas element, it is feasible to use various 2D Canvas drawing APIs to draw what a user wants within an area covered by the canvas element through JavaScript codes.
The English full name of GPU is Graphics Processing Unit, and the Chinese translation thereof is “Tu Xing Chu Li Dan Yuan”. GPU is a concept relative to Central Processing Unit (CPU). GPU is the “brain” of a display card. It determines most performances of the display card and is also a basis for distinguishing a 2D display card or chip from a three-dimensional (3D) display card or chip. A 2D display chip mainly relies on the processing capability of a CPU in processing 3D images and special effects, which is called “software acceleration”. A 3D display chip integrates functions of processing 3D images and special effects into the display chip, i.e., the so-called “hardware acceleration” function.
In implementation of the existing browser, invocation of JavaScript codes for a 2D Canvas drawing API is mapped to a platform-related 2D drawing library. An off-screen bitmap is drawn in the 2D drawing library (this step is usually called the drawing step), and then the bitmap is copied to a visible window of a current program (this step is usually called the mixing step). A defect of such a manner lies in that, whether it is the drawing step or the mixing step, the completion of the step relies on a CPU, which results in a low drawing efficiency, and does not allow a sufficient use of the GPU for hardware acceleration.